<template>
	<view class="container">
		<view class="header">
			<view class="arrow" @tap="$back()"><image src="../../static/images/arrow_left.png" mode="aspectFit"></image></view>
			<view class="tit f36 cfff">个人资料</view>
			<view class="btn f32 cfff">保存</view>
		</view>
		
		<view class="set-box">
			<view class="set-item">
				<view class="name f30 c666">您的姓名</view>
				<input type="text" placeholder-class="f30 c999" placeholder="请输入您的姓名"/>
			</view>
			<view class="set-item">
				<view class="name f30 c666">手机号</view>
				<input type="text" placeholder-class="f30 c999" placeholder="请输入您的手机号"/>
			</view>
			<view class="set-item">
				<view class="name f30 c666">验证码</view>
				<input type="text" placeholder-class="f30 c999" placeholder="请输入验证码"/>
				<view class="sendCode">发送验证码</view>
			</view>
			<view class="set-item">
				<view class="name f30 c666">收货地址</view>
				<input type="text" placeholder-class="f30 c999" placeholder="请输入详细地址"/>
			</view>
			
		</view>
		
		
		
	</view>
</template>

<script>
</script>

<style lang="scss">
	.header{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		background-color: #249AF6;
		padding: 60upx 30upx 25upx 30upx;
		.arrow{
			image{
				width: 20upx;
				height: 40upx;
			}
		}
	}
	.set-box{
		.set-item{
			position: relative;
			padding: 35upx 30upx;
			border-bottom: 2upx #eee solid;
			&:nth-child(3){
				input{
					width: 40%;
				}
			}
			.name{
				position: absolute;
				left:30upx;			
			}
			input{
				padding-left: 160upx;
			}
			.sendCode{
				position: absolute;
				top:35upx;
				right:30upx;
				font-size: 30upx;
				color: #249AF6;
				border-left: 2upx #ddd solid;
				padding-left: 30upx;
			}
		}
	}
</style>
